<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<%@ page language="java" import="java.util.*" pageEncoding="utf-8" %>
<%@ include file="/common/taglibs.jsp" %>

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>账单生成</title>
    <%@ include file="/common/util.jsp" %>

    <script src="${cdnctx}/dep/Calendar/WdatePicker.js"></script>
    <script src="${cdnctx}/dep/jquery/modernizr.js"></script>
    <script src="${cdnctx}/dep/jquery/spin.js"></script>
    <style type="text/css">
        #preview {
            margin: 0 20px;
            float: left;
            border-radius: 10px;
        }
    </style>
    <script type="text/javascript">
        $(function () {
            var param = {
                "title": $("#title").text().trim(),
                "chargeDate": "${startDate}～${endDate}",
                "lastPayDate": "${lastPayDay}",
                "copeProportion": $("#copeproportion").text().trim(),
                "saveElecMoney": $("#saveCost").text().trim(),
                "saveEnergy": $("#savePower").text().trim(),
                "shouldPayMoney": $("#shouldPayMoney").text().trim(),
                "maintenancePrice": $("#maintenancePrice").text().trim(),
                "conventionPrice": $("#conventionPrice").text().trim(),
                "multipleContext": $("#multipleContext").text().trim()
            };
            $("#printPreview").click(function () {
                window.open("printPreview.shtml?" + parseParam(param));
            });

            $("#print").click(function () {
                $.ajax({
                    type: "POST",
                    contentType: "application/json",
                    url: "billPrint.shtml",
                    data: JSON.stringify(param),
                    dataType: "json",
                    success: function (text) {
                        if (text.filename == "error") {
                            dialog_alert("打印出错！");
                            return;
                        }
                        window.open(URL_PATH + text.filename);
                    },
                    error: function () {
                        dialog_alert("error");
                    }
                });
            })
        });

        function printPreview() {
            window.location.href = "printPreview.shtml";
        }
    </script>
</head>
<body class="main">
<div class="-frame -style -luster" id="css_container">
    <!--首页框架页眉部分↓-->
    <%@ include file="/WEB-INF/pages/inc/header.jsp" %>
    <!--首页框架页眉部分↑-->

    <div class="content">

        <!-- Left导航菜单◎开始 -->
        <%@ include file="/WEB-INF/pages/inc/leftmenu.jsp" %>
        <!-- Left导航菜单◎结束 -->

        <div class="main-mid">
            <div class="pos"><img src="${cdnctx}/src/index/img/index.png"/><a
                    href="${cdnctx}/reductoin/reductoinList.shtml">节能管理 </a>><a>${customerInfo.customername}_账单生成</a>
                <span style="float: right;margin-right: 25px;"> <a
                        href="${cdnctx}/economicBenefit/EconomicBenefitscd.shtml?companycode=${companycode }">经济效益</a> | <a
                        href="${cdnctx}/socialBenefits/socialBenefitsList.shtml?companycode=${companycode }">社会效益</a></span>
            </div>
            <div class="css_contentDiv">
                <form id="searchBillForm" action="${cdnctx}/bill/billList.shtml" method="post">
                    <input type="hidden" name="companycode" value="${companycode }"/>

                    <div style="padding:10px;">
                        <label class="search_text">查询年月：</label>
                        <input name="searchMonth" type="text" id="searchMonth" class="search_input"
                               onfocus="WdatePicker({dateFmt:'yyyy-MM'});" value="${monthDate}"/>
                        <input type="submit" id="btnSelect" class="search_btn" value="查&nbsp;询"/>
                    </div>
                </form>
                <div id="billDetail" class="divTable">
                    <div align='center' style='height:400px;background-color:white;padding:10px 10px 10px 10px'>
                        <div id='title' align='center'
                             style='font-weight: bold;font-size:2em;'>${customerInfo.customername }${monthDateChinese }应付节能费用单
                        </div>
                        <br/>

                        <div align='right' style='font-size:1.5em;'>计费周期：${startDate}～${endDate}</div>
                        <div align='right' style='font-size:1.5em;'>最后交费日期：${lastPayDay }</div>
                        <br/>

                        <div align='left' style='font-size:1.5em;'>一、当期节电应付费用：</div>
                        <br/>
                        <table class='list_table'>
                            <thead>
                            <tr>
                                <td>节省电耗（kw.h）</td>
                                <td>节省电费（元）</td>
                                <td>应付比例（%）</td>
                                <td>应付金额（元）</td>
                                <!-- <td>备注</td> -->
                            </tr>
                            </thead>
                            <td id='savePower'>${saveEnergy.savePower}</td>
                            <td id='saveCost'>
                                <fmt:formatNumber value='${saveEnergy.saveCost}' pattern='0.00'/>
                            </td>
                            <td id='copeproportion'>${customerInfo.copeproportion} %</td>
                            <td id='shouldPayMoney'>
                                <fmt:formatNumber value='${customerInfo.copeproportion*saveEnergy.saveCost/100}'
                                                  pattern='0.00'/>
                            </td>
                        </table>
                        <br/>

                        <div align='left' style='font-size:1.5em;'>二、约定费用：</div>
                        <div id='maintenancePrice' align='left' style='font-size:1.5em;margin-left:50px;'>
                            维护费：${maintenancepriceCN }(${customerInfo.maintenanceprice})
                        </div>
                        <div id='conventionPrice' align='left' style='font-size:1.5em;margin-left:50px;'>
                            未计时约定费： ${conventionpriceCN }(${customerInfo.conventionprice})
                        </div>
                        <br/>

                        <div align='left' style='font-size:1.5em;'>三、综上所述：</div>
                        <div id='multipleContext' align='left'
                             style='font-size:1.5em;margin-left:50px;'>${customerInfo.customername }公司${monthDateChinese }应付费用：${multipleCostCN }(${multipleCost})
                        </div>
                    </div>
                </div>
                <!-- <input style="float:right;" id="print" type="button" class="reset_btn" value="打&nbsp;&nbsp;印"/> -->
                <input style="float:right;" id="printPreview" type="button" class="reset_btn" value="打&nbsp;&nbsp;印"/>
            </div>
        </div>

    </div>

    <!--首页框架页尾部分↓-->
    <%@ include file="/WEB-INF/pages/inc/footer.jsp" %>
    <!--首页框架页尾部分↑-->
</div>
</body>
</html>